<!DOCTYPE HTML><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0 minimal-ui"/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="apple-mobile-web-app-status-bar-style" content="black">

<link rel="apple-touch-icon-precomposed" sizes="114x114" href="images/splash/splash-icon.png">
<link rel="apple-touch-icon-precomposed" sizes="180x180" href="images/splash/splash-icon-big.png">
<link rel="apple-touch-startup-image" href="images/splash/splash-screen.png" 	media="screen and (max-device-width: 320px)" />  
<link rel="apple-touch-startup-image" href="images/splash/splash-screen@2x.png" media="(max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2)" /> 
<link rel="apple-touch-startup-image" href="images/splash/splash-screen-six.png" media="(device-width: 375px)">
<link rel="apple-touch-startup-image" href="images/splash/splash-screen-six-plus.png" media="(device-width: 414px)">
<link rel="apple-touch-startup-image" sizes="640x1096" href="images/splash/splash-screen@3x.png" />
<link rel="apple-touch-startup-image" sizes="1024x748" href="images/splash/splash-screen-ipad-landscape" media="screen and (min-device-width : 481px) and (max-device-width : 1024px) and (orientation : landscape)" />
<link rel="apple-touch-startup-image" sizes="768x1004" href="images/splash/splash-screen-ipad-portrait.png" media="screen and (min-device-width : 481px) and (max-device-width : 1024px) and (orientation : portrait)" />
<link rel="apple-touch-startup-image" sizes="1536x2008" href="images/splash/splash-screen-ipad-portrait-retina.png"   media="(device-width: 768px)	and (orientation: portrait)	and (-webkit-device-pixel-ratio: 2)"/>
<link rel="apple-touch-startup-image" sizes="1496x2048" href="images/splash/splash-screen-ipad-landscape-retina.png"   media="(device-width: 768px)	and (orientation: landscape)	and (-webkit-device-pixel-ratio: 2)"/>

<title>Epsilon Mobile Framework - Version 2.0</title>

<link href="styles/style.css"     		 rel="stylesheet" type="text/css">
<link href="styles/framework.css" 		 rel="stylesheet" type="text/css">
<link href="styles/owl.theme.css" 		 rel="stylesheet" type="text/css">
<link href="styles/swipebox.css"		 rel="stylesheet" type="text/css">
<link href="styles/font-awesome.css"	 rel="stylesheet" type="text/css">
<link href="styles/animate.css"			 rel="stylesheet" type="text/css">

<script type="text/javascript" src="scripts/jquery.js"></script>
<script type="text/javascript" src="scripts/jqueryui.js"></script>
<script type="text/javascript" src="scripts/framework.plugins.js"></script>
<script type="text/javascript" src="scripts/custom.js"></script>

</head>
<body> 

<div id="preloader">
	<div id="status">
    	<p class="center-text">
			Loading the content...
            <em>Loading depends on your connection speed!</em>
        </p>
    </div>
</div>
    
       
<div class="all-elements">
    <div class="snap-drawers">
        <!-- Left Sidebar -->
        <div class="snap-drawer snap-drawer-left">
            <a href="index.html"><i class="fa fa-home"></i>Home</a>
            <a href="page-features.html"><i class="fa fa-cog"></i>Features</a>
            <a href="page-media.html" class="selected-item"><i class="fa fa-picture-o"></i>Media</a>
            <a href="page-blog.html"><i class="fa fa-pencil"></i>Blog</a>
            <a href="contact.html"><i class="fa fa-envelope-o"></i>Contact</a>
            <a href="#"><i class="fa fa-facebook"></i>Like Us</a>
            <a href="#"><i class="fa fa-twitter"></i>Follow Us</a>
            <a href="#"><i class="fa fa-google-plus"></i>Follow us</a>
            <a href="#" class="show-share-bottom"><i class="fa fa-retweet"></i>Share</a>
            <a href="#" class="sidebar-close"><i class="fa fa-times"></i>Close</a>
        </div>
    </div>
    
    <div class="header">
        <a href="#" class="main-logo"></a>
        <a href="#" class="open-menu"><i class="fa fa-navicon"></i></a>
        <a href="#" class="open-call"><i class="fa fa-phone"></i></a>
        <a href="#" class="open-mail"><i class="fa fa-envelope-o"></i></a>
        <a href="page-media.html" class="open-back"><i class="fa fa-chevron-left"></i></a>
    </div> 
    
    <a href="#" class="footer-ball"><i class="fa fa-navicon"></i></a>
    
    <!-- Page Content-->
    <div id="content" class="snap-content">        
        <div class="header-clear"></div>
        <div class="content">
 
            <h3>An adaptive image gallery</h3>
            <p>
                An adaptive image gallery, simply tap one of the three icons at the bottom right and the gallery will shift 
                and adjust to change the view of the current thumbnail style. Three columns, two columns or one simple large
                column of icons. Try it! 
            </p>
            
            <div class="decoration"></div>
            
            <div class="adaptive-style">
                <h4>Gallery</h4>
                <a class="adaptive-three-activate active-adaptive-style" href="#"><i class="fa fa-th"></i></a>
                <a class="adaptive-two-activate"   href="#"><i class="fa fa-th-large"></i></a>
                <a class="adaptive-one-activate" href="#"><i class="fa fa-navicon"></i></a>
            </div>
            <div class="clear"></div>

            <div class="decoration"></div>
            
            <div class="portfolio-adaptive adaptive-three">
                <div class="adaptive-item">
                    <a href="images/pictures/1.jpg" class="swipebox" title="Caption Goes Here">
                        <img class="responsive-image" src="images/pictures/1s.jpg" alt="img">
                    </a>
                </div>
                <div class="adaptive-item">
                    <a href="images/pictures/2.jpg" class="swipebox" title="Caption Goes Here">
                        <img class="responsive-image" src="images/pictures/2s.jpg" alt="img">
                    </a>
                </div>
                <div class="adaptive-item">
                    <a href="images/pictures/3.jpg" class="swipebox" title="Caption Goes Here">
                        <img class="responsive-image" src="images/pictures/3s.jpg" alt="img">
                    </a>
                </div>
                <div class="adaptive-item">
                    <a href="images/pictures/4.jpg" class="swipebox" title="Caption Goes Here">
                        <img class="responsive-image" src="images/pictures/4s.jpg" alt="img">
                    </a>
                </div>
                <div class="adaptive-item">
                    <a href="images/pictures/5.jpg" class="swipebox" title="Caption Goes Here">
                        <img class="responsive-image" src="images/pictures/5s.jpg" alt="img">
                    </a>
                </div>
                <div class="adaptive-item">
                    <a href="images/pictures/6.jpg" class="swipebox" title="Caption Goes Here">
                        <img class="responsive-image" src="images/pictures/6s.jpg" alt="img">
                    </a>
                </div>                
                <div class="adaptive-item">
                    <a href="images/pictures/4.jpg" class="swipebox" title="Caption Goes Here">
                        <img class="responsive-image" src="images/pictures/7s.jpg" alt="img">
                    </a>
                </div>
                <div class="adaptive-item">
                    <a href="images/pictures/5.jpg" class="swipebox" title="Caption Goes Here">
                        <img class="responsive-image" src="images/pictures/8s.jpg" alt="img">
                    </a>
                </div>
                <div class="adaptive-item">
                    <a href="images/pictures/6.jpg" class="swipebox" title="Caption Goes Here">
                        <img class="responsive-image" src="images/pictures/1s.jpg" alt="img">
                    </a>
                </div>
            </div>
            <div class="decoration"></div>
            
        </div>
        <!-- Page Footer-->
        <div class="footer">
            <p class="center-text">Copyright 2015. All rights reserved.</p>
            <div class="footer-socials half-bottom">
                <a href="#" class="footer-facebook"><i class="fa fa-facebook"></i></a>
                <a href="#" class="footer-twitter"><i class="fa fa-twitter"></i></a>
                <a href="#" class="footer-transparent"></a>
                <a href="#" class="footer-share show-share-bottom"><i class="fa fa-share-alt"></i></a>
                <a href="#" class="footer-up"><i class="fa fa-angle-up"></i></a>
            </div>
        </div>    
        
    </div>
    
    <div class="share-bottom">
        <h3>Share Page</h3>
        <div class="share-socials-bottom">
            <a href="">
                <i class="fa fa-facebook facebook-color"></i>
                Facebook
            </a>
            <a href="">
                <i class="fa fa-twitter twitter-color"></i>
                Twitter
            </a>
            <a href="">
                <i class="fa fa-google-plus google-color"></i>
                Google
            </a>

            <a href="">
                <i class="fa fa-pinterest-p pinterest-color"></i>
                Pinterest
            </a>
            <a href="sms:">
                <i class="fa fa-comment-o sms-color"></i>
                Text
            </a>
            <a href="">
                <i class="fa fa-envelope-o mail-color"></i>
                Email
            </a>
        </div>
        <a href="#" class="close-share-bottom">Close</a>
    </div>
    
</div>

</body>

